<!DOCTYPE html>
<html>
<head>
    <title>go websocket</title>
    <meta charset="utf-8" />
</head>
<body>
<script type="text/javascript">
    let domain = window.location.host;
    let protocol = document.location.protocol
    let wsUri = ""
    wsUri = "wss://" + domain  + "/ws/v2/a/b"

    if (protocol === "http:"){
        wsUri = "ws://" + domain + "/ws/v2/a/b"
    }
    console.log("wsUri: " + wsUri)

    // let wsUri="ws://47.106.184.68:8091/ws";
    let output;

    function init() {
        output = document.getElementById("output");
        testWebSocket();
    }

    function testWebSocket() {
        websocket = new WebSocket(wsUri);
        websocket.onopen = function(evt) {
            onOpen(evt)
        };
        websocket.onclose = function(evt) {
            onClose(evt)
        };
        websocket.onmessage = function(evt) {
            onMessage(evt)
        };
        websocket.onerror = function(evt) {
            onError(evt)
        };
    }

    function onOpen(evt) {
        writeToScreen("CONNECTED");
        // doSend("WebSocket rocks");
    }

    function onClose(evt) {
        writeToScreen("DISCONNECTED");
    }

    function onMessage(evt) {
        writeToScreen('<span style="color: blue;">RESPONSE: '+ evt.data+'</span>');
        // websocket.close();
    }

    function onError(evt) {
        writeToScreen('<span style="color: red;">ERROR:</span> '+ evt.data);
    }

    function doSend(message) {
        writeToScreen("SENT: " + message);
        websocket.send(message);
    }

    // 输出追加到页面
    function writeToScreen(message) {
        var pre = document.createElement("p");
        pre.style.wordWrap = "break-word";
        pre.innerHTML = message;
        // output.appendChild(pre);
        output.prepend(pre);
    }

    window.addEventListener("load", init, false);
    function sendBtnClick(){
        var msg = document.getElementById("input").value;
        doSend(msg);
        document.getElementById("input").value = '';
    }
    function closeBtnClick(){
        websocket.close();
    }
</script>
<h2>WebSocket Test</h2>
<input type="text" id="input"></input>
<button onclick="sendBtnClick()" >send</button>
<button onclick="closeBtnClick()" >close</button>
<div id="output"></div>

</body>
</html>